<%--
  Created by IntelliJ IDEA.
  User: 你好
  Date: 2024/9/2
  Time: 14:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>6x4 表格</title>
    <style>
        /* 可选：添加一些基本的样式来美化表格 */
        table, th, td {
            border: 1px solid black; /* 给表格、表头和表格单元格添加边框 */
            border-collapse: collapse; /* 让边框合并为一个单一的边框 */
        }

        th, td {
            padding: 10px; /* 给表头和表格单元格添加一些内边距 */
            text-align: left; /* 文本左对齐 */
        }

        th {
            background-color: #f2f2f2; /* 给表头添加背景色 */
        }
    </style>
</head>
<body>

<h2></h2>

<div class="main">
    <table border="1" id="resultTable">
        <tr>
            <th>编号</th>
            <th>姓名</th>
            <th>银行卡号</th>
            <th>手机号码</th>
            <th>余额</th>
            <th>操作</th>
        </tr>
    </table>
</div>

<script src="js/jquery-3.7.1.js"></script>
<script>
    $(function() {
        $.getJSON("transtfeServlet", show);
    });

    function show(data) {
        $(data).each(function(index, v) {
            let tr = $("<tr><td>" + v.id + "</td> <td>" + v.name + "</td><td>" + v.cardnumber + "</td><td>" + v.phone + "</td> <td>" + v.balance + "</td><td><span class='oprBtn' onclick='transferData(\"" + v.id + "\", \"" + v.name + "\")'>转账</span></td></tr>");
            $("#resultTable").append(tr);
        });
    }

    function transferData(id, name) {
        window.location.href = 'index2.jsp?id=' + id + '&name=' + name;
    }
</script>
</body>
</html>